<template>
  <div class="ne">
      <div class="neli">
          <ul class="ne_ul">
              <li v-for="(v,i) in arr" :key="i" @click="fun()">
                  <div class="left"><img :src="v.img"></div>
                  <div class="right">
                      <h3 class="h3">{{v.title}}<span>{{v.time}}</span></h3>
                      <p class="h_p">{{v.np}}</p>
                  </div>
              </li>
          </ul>
      </div>
  </div>
</template>

<script>
export default {
    data(){
        return{
            arr:[
                {title:"订阅号",time:"昨天  14:58",np:"贝壳房帮帮：【品质购房】点击领取30000元···",img:"img/fn1.jpg"},
                {title:"租房攻略",time:"17:05",np:"根据您关注/浏览/搜索过的造园街道办事处···",img:"img/fn2.jpg"},
                {title:"热手热搜",time:"14:53",np:"西安的买房民族都在看",img:"img/fn3.jpg"},
                {title:"新房热门资讯",time:"14:43",np:"西安楼盘周历提醒",img:"img/fn4.jpg"},
                {title:"郝君",time:"14:43",np:"邀请你定制专属置业报告",nq:"为您推荐城北商圈加盟点-锦城A点",img:"img/gn5.jpg"},
                {title:"租房榜单",time:"13:26",np:"为您推荐城北商圈的热门搜索磅，火爆校···",img:"img/fn6.jpg"},
                {title:"新房专属定制",time:"13:26",np:"感兴趣金辉江山名著的人竟然是他们···",img:"img/fn6.jpg"},
                {title:"租房榜单",time:"13:26",np:"为您推荐城北商圈的热门搜索磅，火爆校···",img:"img/gn5.jpg"},
            ]
        }
    },
    methods:{
        fun(){
            this.$router.push({name:"nelizi"})
        }
    }
}
</script>

<style scoped>
.ne{
    width: 92%;
    height: 7.82rem;
    margin: auto;
    margin-top: .44rem;
    /* background: rgb(64, 109, 109); */
}
.ne_ul{
    width: 100%;
    height: 100%;

}
.ne_ul li{
    width: 100%;
    height: .65rem;
    /* border: 1px solid red; */
    padding: .13rem 0;
    display: flex;
    justify-content: space-between;
}
.ne_ul li .left{
    width: 19%;
    height: 100%;
}
.ne_ul li .left img{
    width: 100%;
    height: 100%;
}
.ne_ul li .right{
    width: 77%;
    height: 100%;
    /* background: palegoldenrod; */
}
.ne_ul li .right .h3{
    width: 100%;
    height: 60%;
    font-size: .16rem;
    line-height: .4rem;
    /* border: 1px solid blue; */
}
.ne_ul li .right .h3 span{
    float: right;
    color: #767a7d;
    font-size: .11rem;
    font-weight: normal;
}
.ne_ul li .right .h_p{
    width: 100%;
    height: 40%;
    font-size: .12rem;
    line-height: .27rem;
    color: #767a7d;
    border-bottom: .01rem solid #d6d7d8;
    padding-bottom: .12rem;
}
</style>